@charset "UTF-8";
* {
  margin: 0;
  padding: 0;
  list-style: none;
}

.web{
  header {
    width: 100%;
    height: 8.2vw;
    display: flex;

    .logo {
      flex-grow: 3;
      display: flex;
      margin-left: 2.78vw;
      align-items: center;
      .bos {
        height: 5.35vw;
        overflow: hidden;
        img {
          height: 5.35vw;
        }
      }
    }
    .title {
      display: flex;
      flex-grow: 5;
      align-items: center;
      justify-content: space-between;
      .home {
        width: 7.04vw;
        height: 5.14vw;
        text-align: center;
        border-left: 1px solid #000;
        border-right: 1px solid #000;
        position: relative;
        visibility: hidden;
        transform: rotate(45deg);
        .box1 {
          width: 7.71vw;
          height: 2.84vw;
          display: inline-block;
          visibility: visible;
          font-size: 1.39vw;
          position: absolute;
          left: 50%;
          top: 50%;
          transform: translate(-50%, -50%) rotate(-45deg);
          p{
            color: #222222;
          }
        }
      }
      .home:hover {
        visibility: visible;
        color: red;
      }
    }
  }

  nav>img{
    width: 100%;
  }
  nav>.mad{
    display: flex;
    background-color: #0fc2c4;
  }
  nav>.mad>.turn {
    width: 10.9vw;
    height: 5.49vw;
    background-color: #ffd203;
    margin-left: 16.88vw;
    border-left: 0.2vw solid #069ea0;
    text-align: center;
    p:first-child{
      line-height:2.745vw;
      color: #ffffff;
      font-size: 1.39vw;
    }
    p:last-child{
      line-height:2.745vw;
      color: #ffffff;
      font-size: 0.69vw;
    }
  }
  nav>.mad>.lottery {
    width: 10.9vw;
    height: 5.49vw;
    background-color: #0fc2c4;
    border-left: 0.2vw solid #069ea0;
    border-right: 0.2vw solid #069ea0;
    text-align: center;
    p:first-child{
      line-height:2.745vw;
      color: #ffffff;
      font-size: 1.39vw;
    }
    p:last-child{
      line-height:2.745vw;
      color: #ffffff;
      font-size: 0.69vw;
    }
  }

  nav .all{
    text-align: center;
    position: relative;
  }
  nav .all .new{
    width: 7.85vw;
    height: 2.85vw;
    margin: 0 auto;
    display: inline-block;
    margin-top: 4.38vw;
    border: 0.07vw solid #8b9a99;
    line-height: 2.85vw;
  }
  nav .all .new:first-child{
    width: 5.69vw;
    height: 2.85vw;
    margin: 0 auto;
    display: inline-block;
  }
  nav>.turn {
    width: 65.07vw;
    height: 37.29vw;
    margin: 0 auto;
    margin-top: 7.92vw;
    .gg {
      width: 65.07vw;
      height: 30.92vw;
      display: flex;
      justify-content: space-between;
      .plag {
        width: 20.49vw;
        height: 30.92vw;
        overflow: hidden;
        position: relative;
        img{
          width: 100%;
          margin-left: 0;
          z-index: -1;
        }
        .fan{
          position: absolute;
          left: 0;
          top: 0;
        }
        .shop {
          position: absolute;
          top: 1.25vw;
          left: 15.07vw;
        }
        .shop1{
          background-color: #00e9f9;
        }
      }
    }
  }
  footer{
    height: 5.42vw;
    background-color: #08cacc;
    img:first-child{
      width: 82.1vw;
      left: 5vw;
      float: left;
      margin-top: -13.3vw;
    }
    img:last-child{
      width: 16.46vw;
      height: 14.5vw;
      float: right;
      margin-top: -9.3vw;
    }
  }
}